﻿<Canvas
	xmlns="http://schemas.microsoft.com/client/2007"
	xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
	xmlns:SilverlightToolbox="clr-namespace:SilverlightToolbox;assembly=ClientBin/SilverlightToolbox.dll"
	x:Name="UserControl" 
	Width="920" Height="656" Background="#FFFFFFFF">
	
	<Canvas.Resources>
		<Storyboard x:Name="Timeline1">
			<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="exp32" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleX)">
				<SplineDoubleKeyFrame KeyTime="00:00:02" Value="3"/>
			</DoubleAnimationUsingKeyFrames>
			<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="exp33" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleX)">
				<SplineDoubleKeyFrame KeyTime="00:00:02" Value="3"/>
			</DoubleAnimationUsingKeyFrames>
			<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="exp62" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleX)">
				<SplineDoubleKeyFrame KeyTime="00:00:00" Value="1"/>
				<SplineDoubleKeyFrame KeyTime="00:00:02" Value="3"/>
			</DoubleAnimationUsingKeyFrames>
			<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="exp63" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleX)">
				<SplineDoubleKeyFrame KeyTime="00:00:02" Value="3"/>
			</DoubleAnimationUsingKeyFrames>
			<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="exp32" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleY)">
				<SplineDoubleKeyFrame KeyTime="00:00:02" Value="3"/>
			</DoubleAnimationUsingKeyFrames>
			<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="exp33" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleY)">
				<SplineDoubleKeyFrame KeyTime="00:00:02" Value="3"/>
			</DoubleAnimationUsingKeyFrames>
			<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="exp62" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleY)">
				<SplineDoubleKeyFrame KeyTime="00:00:00" Value="1"/>
				<SplineDoubleKeyFrame KeyTime="00:00:02" Value="3"/>
			</DoubleAnimationUsingKeyFrames>
			<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="exp63" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleY)">
				<SplineDoubleKeyFrame KeyTime="00:00:02" Value="3"/>
			</DoubleAnimationUsingKeyFrames>
		</Storyboard>
	</Canvas.Resources>
	<Canvas Width="608" Height="72" Canvas.Left="8" Canvas.Top="8">
		<Rectangle Width="608" Height="72" Fill="#FFFFFFFF" Stroke="#FF000000"/>
		<TextBlock Width="608" Height="32" Text="One item, Drag Anywhere" TextWrapping="Wrap"/>
		<SilverlightToolbox:DragAndDropOverlayExtender x:Name="OneItemDragAnyehere" Width="24" Height="0" Canvas.Left="72" Canvas.Top="49.526" ElementsToMoveName="exp1"/>
	</Canvas>
	<Canvas x:Name="exp2_area" Width="608" Height="72" Canvas.Left="8" Canvas.Top="92">
		<Rectangle Width="608" Height="72" Fill="#FFFFFFFF" Stroke="#FF000000" x:Name="rect1"/>
		<TextBlock Width="608" Height="32" Text="One item, Drag Inside" TextWrapping="Wrap"/>
		<Ellipse x:Name="exp2" Width="56" Height="32" Stroke="#FF000000" Canvas.Left="368" Canvas.Top="20">
			<Ellipse.Fill>
				<RadialGradientBrush>
					<GradientStop Color="#FF000000" Offset="0"/>
					<GradientStop Color="#FFFFFFFF" Offset="1"/>
				</RadialGradientBrush>
			</Ellipse.Fill>
		</Ellipse>
		<SilverlightToolbox:DragAndDropOverlayExtender x:Name="OneItemDragInside" Width="24" Height="16" Canvas.Left="136" Canvas.Top="36" AllowedAreasElementName="exp2_area" ElementsToMoveName="exp2"/>
	</Canvas>
	<Canvas x:Name="exp4" Width="608" Height="72" Canvas.Left="8" Canvas.Top="179">
		<Rectangle Width="608" Height="72" Fill="#FFFFFFFF" Stroke="#FF000000" x:Name="exp3_area"/>
		<TextBlock Width="608" Height="32" Text="Many items, Drag Inside" TextWrapping="Wrap"/>
		<Ellipse x:Name="exp32" Width="56" Height="32" Stroke="#FF000000" Canvas.Left="368" Canvas.Top="20" RenderTransformOrigin="0.5,0.5" StrokeDashCap="Flat">
			<Ellipse.Fill>
				<RadialGradientBrush>
					<GradientStop Color="#FFB54545" Offset="0.477"/>
					<GradientStop Color="#FFFF4343" Offset="0.986"/>
				</RadialGradientBrush>
			</Ellipse.Fill>
			<Ellipse.RenderTransform>
				<TransformGroup>
					<ScaleTransform ScaleX="1" ScaleY="1"/>
					<SkewTransform AngleX="0" AngleY="0"/>
					<RotateTransform Angle="0"/>
					<TranslateTransform X="0" Y="0"/>
				</TransformGroup>
			</Ellipse.RenderTransform>
		</Ellipse>
		<SilverlightToolbox:DragAndDropOverlayExtender x:Name="ManyItemsDragInside" Width="24" Height="16" Canvas.Left="136" Canvas.Top="36" AllowedAreasElementName="exp3_area" ElementsToMoveName="exp31, exp32, exp33"/>
		<Ellipse x:Name="exp31" Width="56" Height="32" Stroke="#FF000000" RenderTransformOrigin="4.286,1.156" Canvas.Left="104" Canvas.Top="32">
			<Ellipse.Fill>
				<RadialGradientBrush>
					<GradientStop Color="#FF3BE445" Offset="0.233"/>
					<GradientStop Color="#FF35A93C" Offset="0.81"/>
				</RadialGradientBrush>
			</Ellipse.Fill>
		</Ellipse>
		<Ellipse x:Name="exp33" Width="56" Height="32" Stroke="#FF000000" RenderTransformOrigin="0.5,0.5" StrokeDashCap="Flat" Canvas.Left="248" Canvas.Top="20">
			<Ellipse.Fill>
				<RadialGradientBrush>
					<GradientStop Color="#FFFAE3FF" Offset="0"/>
					<GradientStop Color="#FFD300FF" Offset="1"/>
				</RadialGradientBrush>
			</Ellipse.Fill>
			<Ellipse.RenderTransform>
				<TransformGroup>
					<ScaleTransform ScaleX="1" ScaleY="1"/>
					<SkewTransform AngleX="0" AngleY="0"/>
					<RotateTransform Angle="0"/>
					<TranslateTransform X="0" Y="0"/>
				</TransformGroup>
			</Ellipse.RenderTransform>
		</Ellipse>
	</Canvas>
	<Canvas x:Name="exp5" Width="608" Height="72" Canvas.Left="8" Canvas.Top="280">
		<Rectangle Width="128" Height="72" Fill="#FFFFFFFF" Stroke="#FFC4C4C4" x:Name="exp4_area2" StrokeThickness="1" Canvas.Left="232"/>
		<Rectangle Width="192" Height="72" Fill="#FFFFFFFF" Stroke="#FFC4C4C4" x:Name="exp4_area3" StrokeThickness="1" Canvas.Left="408"/>
		<Rectangle Width="192" Height="72" Fill="#FFFFFFFF" Stroke="#FFC4C4C4" x:Name="exp4_area1" StrokeThickness="1"/>
		<TextBlock Width="608" Height="32" Text="One Item, Many Areas" TextWrapping="Wrap"/>
		<SilverlightToolbox:DragAndDropOverlayExtender x:Name="OneItemsManyAreas" Width="24" Height="16" Canvas.Left="136" Canvas.Top="36" AllowedAreasElementName="exp4_area1, exp4_area2, exp4_area3" ElementsToMoveName="exp41"/>
		<Ellipse x:Name="exp41" Width="56" Height="32" Stroke="#FF000000" RenderTransformOrigin="4.286,1.156" Canvas.Left="104" Canvas.Top="32">
			<Ellipse.Fill>
				<RadialGradientBrush>
					<GradientStop Color="#FF3BE445" Offset="0.233"/>
					<GradientStop Color="#FF35A93C" Offset="0.81"/>
				</RadialGradientBrush>
			</Ellipse.Fill>
		</Ellipse>
	</Canvas>
	<Canvas x:Name="exp6" Width="608" Height="72" Canvas.Left="8" Canvas.Top="368">
		<Rectangle Width="128" Height="72" Fill="#FFFFFFFF" Stroke="#FFC4C4C4" x:Name="exp6_area2" StrokeThickness="1" Canvas.Left="232"/>
		<Rectangle Width="192" Height="72" Fill="#FFFFFFFF" Stroke="#FFC4C4C4" x:Name="exp6_area3" StrokeThickness="1" Canvas.Left="408"/>
		<Rectangle Width="192" Height="72" Fill="#FFFFFFFF" Stroke="#FFC4C4C4" x:Name="exp6_area1" StrokeThickness="1"/>
		<TextBlock Width="608" Height="32" Text="Many Items, Many Areas" TextWrapping="Wrap"/>
		<Ellipse x:Name="exp62" Width="56" Height="32" Stroke="#FF000000" Canvas.Left="424" Canvas.Top="20" RenderTransformOrigin="0.5,0.5" StrokeDashCap="Flat" StrokeDashArray="2 1">
			<Ellipse.Fill>
				<RadialGradientBrush>
					<GradientStop Color="#FFB54545" Offset="0.477"/>
					<GradientStop Color="#FFFF4343" Offset="0.986"/>
				</RadialGradientBrush>
			</Ellipse.Fill>
			<Ellipse.RenderTransform>
				<TransformGroup>
					<ScaleTransform ScaleX="1" ScaleY="1"/>
					<SkewTransform AngleX="0" AngleY="0"/>
					<RotateTransform Angle="0"/>
					<TranslateTransform X="0" Y="0"/>
				</TransformGroup>
			</Ellipse.RenderTransform>
		</Ellipse>
		<SilverlightToolbox:DragAndDropOverlayExtender x:Name="ManyItemsManyAreas1" Width="24" Height="16" Canvas.Left="136" Canvas.Top="36" AllowedAreasElementName="exp6_area1, exp6_area2, exp6_area3" ElementsToMoveName="exp61, exp62, exp63"/>
		<Ellipse x:Name="exp61" Width="56" Height="32" Stroke="#FF000000" RenderTransformOrigin="4.286,1.156" Canvas.Left="104" Canvas.Top="32">
			<Ellipse.Fill>
				<RadialGradientBrush>
					<GradientStop Color="#FF3BE445" Offset="0.233"/>
					<GradientStop Color="#FF35A93C" Offset="0.81"/>
				</RadialGradientBrush>
			</Ellipse.Fill>
		</Ellipse>
		<Ellipse x:Name="exp63" Width="56" Height="32" Stroke="#FF000000" Canvas.Left="504" Canvas.Top="20" RenderTransformOrigin="-3.429,0.625" StrokeDashCap="Flat" StrokeEndLineCap="Round">
			<Ellipse.Fill>
				<RadialGradientBrush>
					<GradientStop Color="#FFFAE3FF" Offset="0"/>
					<GradientStop Color="#FFD300FF" Offset="1"/>
				</RadialGradientBrush>
			</Ellipse.Fill>
			<Ellipse.RenderTransform>
				<TransformGroup>
					<ScaleTransform ScaleX="1" ScaleY="1"/>
					<SkewTransform AngleX="0" AngleY="0"/>
					<RotateTransform Angle="0"/>
					<TranslateTransform X="0" Y="0"/>
				</TransformGroup>
			</Ellipse.RenderTransform>
		</Ellipse>
		<TextBlock Width="24" Height="0" Canvas.Left="456" Canvas.Top="224" Text="TextBlock" TextWrapping="Wrap"/>
	</Canvas>
	<TextBlock Width="136" Height="32" Canvas.Left="8" Canvas.Top="464" Text="Scrollbars" TextWrapping="Wrap" x:Name="tbxScrollbars"/>
	<Canvas x:Name="horizontal_scrollbar" Width="312" Height="32" Canvas.Left="56" Canvas.Top="486">
		<Rectangle Width="272" Height="8" x:Name="sliderBackground" RenderTransformOrigin="0.5,0.5" Canvas.Top="14" Canvas.Left="28.681">
			<Rectangle.Fill>
				<LinearGradientBrush EndPoint="1,0.5" StartPoint="0,0.5">
					<GradientStop Color="#FF000000" Offset="0"/>
					<GradientStop Color="#FF302525" Offset="0.989"/>
					<GradientStop Color="#FF484848" Offset="0.285"/>
					<GradientStop Color="#FFA3A3A3" Offset="0.676"/>
					<GradientStop Color="#FF818181" Offset="0.897"/>
				</LinearGradientBrush>
			</Rectangle.Fill>
			<Rectangle.RenderTransform>
				<TransformGroup>
					<ScaleTransform ScaleX="1" ScaleY="1"/>
					<SkewTransform AngleX="0" AngleY="0"/>
					<RotateTransform Angle="0"/>
					<TranslateTransform X="0" Y="0"/>
				</TransformGroup>
			</Rectangle.RenderTransform>
		</Rectangle>
		<Rectangle x:Name="slider" Width="8" Height="32" Stroke="#FFD4FF96" RenderTransformOrigin="0.5,0.5" Canvas.Left="169.151">
			<Rectangle.Fill>
				<LinearGradientBrush EndPoint="1.941,0.593" StartPoint="-0.691,0.559">
					<GradientStop Color="#FF7CDD2B" Offset="0.176"/>
					<GradientStop Color="#FF9FEE5B" Offset="0.842"/>
					<GradientStop Color="#FFD7F8B9" Offset="0.563"/>
				</LinearGradientBrush>
			</Rectangle.Fill>
			<Rectangle.RenderTransform>
				<TransformGroup>
					<ScaleTransform ScaleX="1" ScaleY="1"/>
					<SkewTransform AngleX="0" AngleY="0"/>
					<RotateTransform Angle="0"/>
					<TranslateTransform X="0" Y="0"/>
				</TransformGroup>
			</Rectangle.RenderTransform>
		</Rectangle>
		<SilverlightToolbox:DragAndDropOverlayExtender x:Name="horizaontal_scrollbar" Width="16" Height="10" Canvas.Left="56" AllowedAreasElementName="sliderBackground" DoNotChangeCanvasTop="True" ElementsToMoveName="slider" EnableOneClickMove="True"/>
	</Canvas>
	<Canvas x:Name="vertical" Width="56" Height="196" Canvas.Left="620" Canvas.Top="320">
		<Rectangle Width="8" Height="196" x:Name="sliderBackground1" RenderTransformOrigin="0.5,0.5" StrokeThickness="0" Canvas.Left="24">
			<Rectangle.Fill>
				<LinearGradientBrush EndPoint="0,0.5" StartPoint="1,0.5">
					<GradientStop Color="#FF000000" Offset="0"/>
					<GradientStop Color="#FF302525" Offset="0.989"/>
					<GradientStop Color="#FF484848" Offset="0.285"/>
					<GradientStop Color="#FFA3A3A3" Offset="0.676"/>
					<GradientStop Color="#FF818181" Offset="0.897"/>
				</LinearGradientBrush>
			</Rectangle.Fill>
			<Rectangle.RenderTransform>
				<TransformGroup>
					<ScaleTransform ScaleX="1" ScaleY="1"/>
					<SkewTransform AngleX="0" AngleY="0"/>
					<RotateTransform Angle="0"/>
					<TranslateTransform X="0" Y="0"/>
				</TransformGroup>
			</Rectangle.RenderTransform>
		</Rectangle>
		<Rectangle x:Name="slider1" Width="56" Height="8" Stroke="#FFD4FF96" RenderTransformOrigin="0.5,0.5" Canvas.Top="102">
			<Rectangle.Fill>
				<LinearGradientBrush EndPoint="0.649,9.786" StartPoint="0.601,-8.634">
					<GradientStop Color="#FF7CDD2B" Offset="0.176"/>
					<GradientStop Color="#FF9FEE5B" Offset="0.842"/>
					<GradientStop Color="#FFD7F8B9" Offset="0.563"/>
				</LinearGradientBrush>
			</Rectangle.Fill>
			<Rectangle.RenderTransform>
				<TransformGroup>
					<ScaleTransform ScaleX="1" ScaleY="1"/>
					<SkewTransform AngleX="0" AngleY="0"/>
					<RotateTransform Angle="0"/>
					<TranslateTransform X="0" Y="0"/>
				</TransformGroup>
			</Rectangle.RenderTransform>
		</Rectangle>
		<SilverlightToolbox:DragAndDropOverlayExtender x:Name="vertical_scrollbar1" Width="16" Height="10" AllowedAreasElementName="sliderBackground1" DoNotChangeCanvasTop="False" ElementsToMoveName="slider1" EnableOneClickMove="True" Canvas.Left="28" Canvas.Top="88" DoNotChangeCanvasLeft="True"/>
	</Canvas>
	<Canvas x:Name="vertical_Copy" Width="56" Height="196" Canvas.Left="704" Canvas.Top="322">
		<Rectangle Width="8" Height="196" x:Name="sliderBackground2" RenderTransformOrigin="0.5,0.5" StrokeThickness="0" Canvas.Left="24">
			<Rectangle.Fill>
				<LinearGradientBrush EndPoint="0,0.5" StartPoint="1,0.5">
					<GradientStop Color="#FF000000" Offset="0"/>
					<GradientStop Color="#FF302525" Offset="0.989"/>
					<GradientStop Color="#FF484848" Offset="0.285"/>
					<GradientStop Color="#FFA3A3A3" Offset="0.676"/>
					<GradientStop Color="#FF818181" Offset="0.897"/>
				</LinearGradientBrush>
			</Rectangle.Fill>
			<Rectangle.RenderTransform>
				<TransformGroup>
					<ScaleTransform ScaleX="1" ScaleY="1"/>
					<SkewTransform AngleX="0" AngleY="0"/>
					<RotateTransform Angle="0"/>
					<TranslateTransform X="0" Y="0"/>
				</TransformGroup>
			</Rectangle.RenderTransform>
		</Rectangle>
		<SilverlightToolbox:DragAndDropOverlayExtender x:Name="vertical_scrollbar2" Width="16" Height="10" AllowedAreasElementName="sliderBackground2" DoNotChangeCanvasTop="False" ElementsToMoveName="slider2" EnableOneClickMove="True" Canvas.Left="28" Canvas.Top="88" DoNotChangeCanvasLeft="True"/>
		<Ellipse x:Name="slider2" Width="40" Height="24" Stroke="#FFD4FF96" Canvas.Left="8" Canvas.Top="88">
			<Ellipse.Fill>
				<LinearGradientBrush EndPoint="0.649,9.786" StartPoint="0.601,-8.634">
					<GradientStop Color="#FF7CDD2B" Offset="0.176"/>
					<GradientStop Color="#FF9FEE5B" Offset="0.842"/>
					<GradientStop Color="#FFD7F8B9" Offset="0.563"/>
				</LinearGradientBrush>
			</Ellipse.Fill>
		</Ellipse>
	</Canvas>
	<SilverlightToolbox:EventToAction Width="16" Height="8" ElementsToListenName="horizaontal_scrollbar" EventToListen="ElementMoved" TargetAction="Text" Target_Name="tbxStatus" TargetActionArguments="CanvasLeftPercent"/>
	<TextBlock x:Name="tbxStatus" Width="160" Height="32" Canvas.Left="240" Canvas.Top="454" Text="" TextWrapping="Wrap"/>
	<SilverlightToolbox:EventToAction Width="16" Height="8" ElementsToListenName="horizaontal_scrollbar" EventToListen="Drop" TargetAction="Text" Target_Name="tbxStatus" TargetActionArguments="Droped!"/>
	
	<Path x:Name="exp1" Width="86.5" Height="43.026" Stretch="Fill" Stroke="#FF000000" Data="M352.5,30 C349.68023,37.795826 351.90369,39.945697 345,48 338.36356,55.742513 340.40138,57 328.5,57 309.10063,57 292.33522,58.335221 276,42 292.60375,25.396255 337.5,41.448286 337.5,15 345.5,15 353.5,15 361.5,15 359.35855,20.353633 353.06518,23.804467 351,30 351.5,30 352,30 352.5,30 z" Canvas.Left="217.5" Canvas.Top="8" Canvas.ZIndex="0">
		<Path.Fill>
			<LinearGradientBrush EndPoint="1,0.5" StartPoint="0,0.5">
				<GradientStop Color="#FF000000" Offset="0"/>
				<GradientStop Color="#FFFFFFFF" Offset="1"/>
			</LinearGradientBrush>
		</Path.Fill>
	</Path>
	
</Canvas>